<template>
  <div class="process-table-wp">
  	<el-table :data="_d.list" style="width: 100%" border>
  		<el-table-column type="expand">
  			<template #default="scope">
  				<TemplateList :data="scope.row.formTemplates"></TemplateList>
  			</template>
			</el-table-column>
			<el-table-column prop="orderId" label="序号" width="55" align="center" />
			<el-table-column prop="phaseName" label="阶段名称" width="300" show-overflow-tooltip />
			<el-table-column prop="description" label="阶段描述" show-overflow-tooltip />
			<el-table-column label="操作" width="250" align="center" fixed="right" show-overflow-tooltip>
				<template #default="scope">
					<el-button icon="el-icon-edit" size="small" text type="primary" @click="edit(scope.row)">编辑阶段</el-button>
					<el-button icon="el-icon-delete" size="small" text type="primary" @click="deleteRow(scope.row)">删除阶段</el-button>
				</template>
			</el-table-column>
		</el-table>
  </div>
</template>

<script setup>
	import { reactive, ref, onMounted } from 'vue'
	import { ElMessageBox, ElNotification } from 'element-plus';
	import TemplateList from "./TemplateList.vue";
	import {$get, $post, $postparams} from '/@/utils/request';

	const emits = defineEmits(['edit']);

	const props = defineProps({
		id: {
			type: [String,Number],
			default: ''
		}
	})

	const _d = reactive({
		list: [
			// {sort: 1, aa1: '前期材料', aa3: '0'},
			// {sort: 2, aa1: '过程材料', aa3: '0'},
			// {sort: 3, aa1: '验收材料', aa3: '0'},
		]
	})
	
	onMounted(() => {
		getData();
	})

	const getData = () => {
		let params = {
			input: props.id
		}
		$get('/projectTemplateModule/getphasetemplatebyid', params).then(res => {
			_d.list = res.result;
		})
	}

	// 编辑阶段
	const edit = (row) => {
		emits('edit', props.id, row);
	}

	// 删除阶段
	const deleteRow = (row) => {
		ElMessageBox.confirm('此操作将删除该阶段，是否继续？', '提示', {
			type: 'warning'
		}).then(async () => {
			let params = {
				input: row.id
			}
			var res = await $postparams('/projectTemplateModule/removephasetemplate', params);
			ElNotification({
		    title: '提示',
		    message: '删除成功',
		    type: 'success',
		  })
		  // 更新列表
		  getData();
		})
	}

	defineExpose({
		id: props.id,
		reload: getData
	})

</script>

<style lang="scss" scoped>
.process-table-wp {
	padding: 10px 25px;
}
</style>